﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title></title>
    <link href="lib/css/layui.css" rel="stylesheet" />

    <style type="text/css">
        #content {
            width: 300px;
            height: 250px;
            background: #ffffff;
            border-radius: 10px;
            color: #666;
            margin: 0 auto;
            margin-top: 25px;
            text-align: left;
            padding: 15px;
        }

        #login-box {
            text-align: center;
            padding: 80px;
            
        }

        .login_title {
            text-align: center;
            padding: 0 20px 20px 20px;
            font-size:16px;
        }
    </style>



    <script src="lib/layui.js"></script>
    <script src="lib/lay/modules/form.js"></script>



</head>
<body style="background:url(images/login_bg.jpg) no-repeat #222D32; background-size:100%;">

    <div id="login-box">
        <img src="images/logo.png" width="190" />
        <div id="content">
            <p class="login_title">找回密码</p>
            <form method="post" class="layui-form">
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:50px;">邮箱</label>
                    <div class="layui-input-inline">
                        <input type="text" name="title" required lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input">
                    </div>
                </div>
                
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:50px;">
                        校验
                    </label>

                    <div class="layui-input-inline">
                        <input type="text" required lay-verify="required" placeholder="请输入验证码" autocomplete="off" class="layui-input" style="width:100px;display:inline;">
                        <img src="http://oa.mojocube.com/Identify/CheckCode.aspx" width="80" height="30" alt="验证码" />
                    </div>

                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:50px;">验证码</label>
                    <div class="layui-input-inline">
                        <input type="password" name="password" required lay-verify="required" placeholder="请输入邮箱收到的验证码" autocomplete="off" class="layui-input">
                    </div>

                </div>
                <div class="layui-form-item" style="width:100%;padding-left:40px;">
                    <div class="layui-input-inline" style="text-align:left;width:100%">
                        <a href="login.html">登录</a>
                        <button class="layui-btn" lay-submit lay-filter="formDemo" style="margin-left:60px;">找回密码</button>
                    </div>
                </div>

            </form>

        </div>

    </div>

    <script>
        //Demo
        layui.use('form', function () {
            var form = layui.form();

            //监听提交
            form.on('submit(formDemo)', function (data) {
                layer.msg(JSON.stringify(data.field));
                return false;
            });
        });
    </script>

</body>
</html>
